<template>
	<view>

<!-- 		<view class="container" style="font-size: 28px;">

			<uni-nav-bar shadow left-icon="left" @clickLeft="back" leftText="返回" rightText="" title="选择住院人员"
				@clickRight="right()" />

		</view> -->

			<!-- <view v-for="(item, index) in campusList" :key="item.id" :ref="'item'+index" @click="onClick(item.id)"  class="flex-col zhuyuanrenyuan"> -->

		<view class="flex-col zhuyuanrenyuan" >
			
			<view class="u-line-1 text">请选择住院人信息</view>
			<view v-for="(item, index) in inpatients" :key="item.id" style="width: 100%; height: 250px;" @click="onClick(item.id)" >
			<view class="flex-col wrapper" >
				<view class="flex-row wraper-row" v-if="item.status=='已出院'">
					<view class="u-line-1 text-two">{{item.thePatient.name}}</view>
					
					<!-- <u-tag class="tag" text="住院中" shape="circle"></u-tag> -->
					<u-tag text="已出院" shape="circle"></u-tag>
				</view>
				<view class="flex-row wraper-row" v-if="item.status=='住院中'">
					<view class="u-line-1 text-two">{{item.thePatient.name}}</view>
					<u-tag class="tag" text="住院中" shape="circle"></u-tag>
					<!-- <u-tag text="已出院" shape="circle"></u-tag> -->
				</view>
		<!-- 		<view class="flex-row wraper-row-two">
					<view class="u-line-1 text-three">住院号</view>
					<view class="u-line-1 text-four">{{item.thePatient.hospitalNumber}}</view>
				</view> -->
				<view class="flex-row wraper-row-three">
					<view class="u-line-1 text-five">就诊卡号</view>
					<view class="u-line-1 text-six">{{item.thePatient.hospitalNumber}}</view>
				</view>
				<view class="flex-row wraper-row-four">
					<view class="u-line-1 text-seven">入院时间</view>
					<view class="u-line-1 text-eight">{{item.hospitalizedTime}}</view>
				</view>
				<view class="flex-row wraper-row-five">
					<view class="u-line-1 text-nine">出院时间</view>
					<view class="u-line-1 text-ten">{{item.leavehospitalTime}}</view>
				</view>
			</view>
			</view>
		</view>
	</view>

</template>
<script>
	export default {
		data() {
			return {
				inpatients:{}
			}
		},
		onLoad() {
			const user = uni.getStorageSync("user")
			// console.log(user)
			this.userId = user.id
			
			uni.request({
				url:"http://localhost:9000/user/user/inpatient/inpatientUserId/" + this.userId,
				method: "GET",
				success: (res) => {
					// console.log(res)
					if (res.data.code == 20000) {
						this.inpatients = res.data.data.inpatients
						// console.log(this.inpatients)
					}
				}
			})
			// console.log(this.userId)
		},
		methods: {
			onClick(id) {
				// console.log("id::::::"+id)
				uni.navigateTo({
					url: "./zhuyuancost?id=" + id,
				})
			},
		}
	}
</script>
<style lang="scss" scoped>
	page {
		background-color: #fff;
	}

	/** 全局样式-开始,建议放在公共css样式文件中,比如common.css 或app.vue文件 */

	html,
	body {
		margin: 0;
		width: 100%;
		height: 100%;
		font-size: 16px
	}

	view,
	text,
	image {
		position: relative;
		box-sizing: border-box;
		flex-shrink: 0;
	}

	.flex-col {
		display: flex;
		align-items: flex-start;
		flex-direction: column;
	}

	.flex-row {
		display: flex;
		align-items: flex-start;
	}

	.flex-col .flex-row {
		width: 100%
	}

	/** 全局样式-结束*/

	.zhuyuanrenyuan {
		height: 367px;
		padding: 62px 0px 0px 23px;

		.text {
			width: 178px;
			margin: 0px 0px 23px 5px;
			font-size: 20px;
		}

		.wrapper {
			width: 349px;
			height: 228px;
			padding: 8px 23px 0px 23px;
			background: rgba(245, 249, 255, 1);

			.wraper-row {
				width: 267px;
				margin: 0px 0px 24px 6px;

				.text-two {
					width: 82px;
					margin: 3px 84px 0px 0px;
					font-size: 18px;
				}

				.tag {
					margin-right: 11px;
				}
			}

			.wraper-row-two {
				width: 180px;
				justify-content: space-between;
				margin-bottom: 22px;

				.text-three {
					width: 62px;
					font-size: 16px;
					color: rgba(213, 190, 178, 1);
				}

				.text-four {
					width: 99px;
					font-size: 16px;
					color: rgba(104, 69, 55, 1);
				}
			}

			.wraper-row-three {
				width: 233px;
				justify-content: space-between;
				margin-bottom: 21px;

				.text-five {
					width: 78px;
					font-size: 16px;
					color: rgba(213, 190, 178, 1);
				}

				.text-six {
					width: 152px;
					font-size: 16px;
					color: rgba(104, 69, 55, 1);
				}
			}

			.wraper-row-four {
				width: 233px;
				justify-content: space-between;
				margin-bottom: 22px;

				.text-seven {
					width: 78px;
					font-size: 16px;
					color: rgba(213, 190, 178, 1);
				}

				.text-eight {
					width: 182px;
					font-size: 16px;
					color: rgba(104, 69, 55, 1);
				}
			}

			.wraper-row-five {
				width: 233px;
				justify-content: space-between;

				.text-nine {
					width: 78px;
					font-size: 16px;
					color: rgba(213, 190, 178, 1);
				}

				.text-ten {
					width: 152px;
					font-size: 16px;
					color: rgba(104, 69, 55, 1);
				}
			}
		}
	}
</style>
